<template>
    <div class="test1">
        <div class="test1_info">
             <span class="wrapper">
                <el-button type="warning">博客<P>0</P></el-button>
                <el-button type="info">总评论<P>0</P></el-button>
                <el-button type="success">总访问量<P>0</P></el-button>
                <el-button type="danger">留言数<P>0</P></el-button>
                <el-button type="warning">今日访问数<P>0</P></el-button>
            </span>
        </div>
        <div class="data-view">
            <div id="echarts" style="width:100%;height:400px;padding-top:40px"></div>
        </div>
    </div>
</template>
<script>
    export default {
        name: 'test1',
        data() {
            return {

            }
        },
        //调用
        mounted() {
            this.drawLine()
        },
        methods:
            {
                drawLine(){
                    let myChart = this.$echarts.init(document.getElementById('echarts'));
                    myChart.setOption({
                        title:{text:'近一个月的访问量'},
                        tooltip:{},
                        xAxis:{
                            data:[
                                "1","2","3","4","5","6","7","8","9","10",
                                "11","12","13","14","15","16","17","18","19","20",
                                "21","22","23","24","25","26","27","28","29","30"
                            ]
                        },
                        yAxis: {},
                        series: [{
                            name: '销量',
                            type: 'bar',
                            data: [
                                5, 20, 36, 10, 10, 20,5, 20, 36, 10,
                                5, 20, 36, 10, 10, 20,5, 20, 36, 10,
                                5, 20, 36, 10, 10, 20,5, 20, 36, 10
                            ]
                        }]
                    });
                }
            }
    }
</script>
<style lang="scss">
    .test1 {
        .test1_info {
            .wrapper {
                button {
                    padding: 30px;
                }
            }
        }
    }
</style>